<script type="application/javascript">
    $(function () {
    	//加载文章分类列表数据
        loadArticleType();
    	//加载文章列表数据
    	loadArticle();
		//给保存按钮绑定点击事件
		$("#saveButton").click(function() {
			$("#articleTypeForm").ajaxSubmit({
				type : "POST",
				success : function(data) {
					if (data.success) {
						$.messager.popup("保存成功");
						loadArticleType();
					} else {
						$.messager.alert("提示", data.errorMsg);
					}
					$("#myModal").modal("hide");
				}
			})
		})
    })
    
    //加载文章分类列表数据
	function loadArticleType() {
        $("#articleTypeList").load("/articleTypes")
	}
    //回显文章分类弹出层数据
	function editArticleType(obj) {
		var json;
		//判断obj是否为null
		// 如果if表达式中的值是null、0、undefined就返回false，否则返回true
		if (!obj) {
			//自定义json数据,用于新增微信菜单按钮时使用，只需要属性，属性值都为空，目的是为了这个方法通用
			json = {
				"name" : "",
				"code" : "",
				"id" : "",
				"status" : 1,
				"sort" : 0
			};
			
		} else {
			//在编辑时，获取按钮对象的属性
			json = $(obj).data("json");
		}

		$("#myModal").modal("show");
		//回显按钮数据
		$("#id").val(json.id);
		$("#name").val(json.name);
		$("#code").val(json.code);
		$("#status").val(json.status);
		$("#sort").val(json.sort);
	}

	//删除按钮
	function deleteArticleType(articleTypeId) {
		$.messager.confirm("提示", "是否确定删除", function() {
			$.ajax({
				url : "/articleTypes/" + articleTypeId,
				type : "DELETE",
				success : function(data) {
					if (data.success) {
						$.messager.popup("删除成功");
					} else {
						$.messager.alert("提示", data.errorMsg);
					}
					loadArticleType();
				}
			})
		})

	}
	
	//加载文章数据列表
	function loadArticle(articleTypeCode,obj){
		// 如果if表达式中的值是null、0、undefined就返回false，否则返回true
		if (articleTypeCode) {
			//点击了左边的文章分类，加上一个背景色
			$("#articleTypeTbody").children("tr").each(function(){
				$(this).removeClass("success");
			})
			$(obj).addClass("success")
			$("#articleList").load("/articles?articleTypeCode="+articleTypeCode)
		}else{
			$("#articleList").load("/articles")
		}
	}
	
	//编辑文章
	function editArticle(articleId){
		$("#content").load("/articles/add?id="+articleId)
	}

</script>
<div class="container-fluid cm-container-white">
	<div class="row">
		<div class="col-sm-2">
			<div class="panel panel-default">
				<div class="panel-body" id="articleTypeList"></div>
			</div>
		</div>
		<div class="col-sm-10">
			<div class="panel panel-default">
				<div class="panel-body" id="articleList"></div>
			</div>
		</div>
	</div>

	<!-- 新增和修改文章分类模态框 -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
					<h4 class="modal-title" id="myModalLabel">添加按钮</h4>
				</div>
				<form action="/articleTypes" method="post" id="articleTypeForm">
					<input type="hidden" name="id" id="id" /> <input type="hidden"
						name="status" id="status" /> <input type="hidden" name="sort"
						id="sort" />
					<div class="modal-body">
						<div class="form-group">
							<label>文章分类名</label> <input class="form-control" name="name"
								id="name">
						</div>
						<div class="form-group">
							<label>文章编号</label> <input class="form-control" name="code"
								id="code">
						</div>
						<div class="modal-footer">
							<button type="button" class="btn btn-default"
								data-dismiss="modal">关闭</button>
							<button type="button" class="btn btn-primary" id="saveButton">保存</button>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>



